<template>
	<view>
		<view class="auth">
			<view class="wanl-title">修改{{username}}密码</view> 
			<form @submit="formSubmit">
				<view class="auth-group radius-bock bg-gray wlian-grey-light">
					<input confirm-type="done" placeholder="请填写您的新密码" password type="text" placeholder-class="placeholder" name="newpassword" @input="onKeyInput" ></input>
					<input name="mobile" disabled :value="mobile" style="display: none;" ></input>
					<input name="captcha" disabled :value="captcha" style="display: none;" ></input>
				</view>
				<view class="auth-button flex flex-direction">
					<button class="cu-btn bg-orange sl radius-bock" formType="submit" :disabled="submitDisabled">修改密码</button>
				</view>
			</form>
		</view>
	</view>
</template>
<script>
import graceChecker from '@/common/graceChecker';//来自 graceUI 的表单验证， 使用说明见手册 http://grace.hcoder.net/doc/info/73-3.html
import { mapState } from 'vuex';
export default {
	data() {
		return {
			username: this.$store.state.user.username,
			mobile: '',
			captcha: '',
			submitDisabled: true
		};
	},
	computed: {
		...mapState(['user'])
	},
	onLoad(options) {
		this.mobile = options.mobile;
		this.captcha = options.captcha;
	},
	methods: {
		onKeyInput(e) {
			this.submitDisabled = false
		},
		async formSubmit(e) {
			//将下列代码加入到对应的检查位置
			//定义表单规则
			var rule = [
				//{ name: 'mobile', checkType: 'phoneno', errorMsg: '请输入正确手机号' },
				//{ name: "captcha", checkType: "zipcode", errorMsg: "验证码至少6位" },
				{ name: "newpassword", checkType: "string", checkRule: "6,12", errorMsg: "密码应为6-12个字符" }
			];
			//进行表单检查
			var formData = e.detail.value;
			var checkRes = graceChecker.check(formData, rule);
			if (checkRes) {
				await uni.request({
				    url: '/wanlshop/user/password', 
					method: 'POST',
					data:{
						//mobile: formData.mobile,  
						//captcha: formData.captcha,
						uid:this.$store.state.user.id,
						newpassword: formData.newpassword
					},
				     success: res => {
						  console.log(res);
						var result = res.data==null? res.res: res;
						
						console.log(result);
						if(result.code==0){
							this.$wanlshop.msg(res.data.msg);
							return;
						}
						// 提示
						uni.showModal({
							title: '提示',
							content: '修改密码成功',
							success: (msg)=> {
								if (msg.confirm) {
									uni.hideLoading();
									 uni.switchTab({   url: '/pages/user'   });
								} else if (msg.cancel) {
									console.log('用户点击取消');
								}
							}
						});	
						
											
				        // 返回				       
				    }
				});
			} else {
				this.$wanlshop.msg(graceChecker.error);
			}
		}
	}
};
</script>

<style>
	@import url("auth.css");
</style>
